<template>
	<div>
		<Card :bordered="false" class="con_card" >
			<div class="job_top">
				<div class="job_top_ job_top_one">
					<div class="job_man_topone">
						<span class="job_top_span">关键词</span>
					</div>
					<div class="job_toptwo">
						<Input v-model="keyword" placeholder="请输入"/>
					</div>
				</div>
				<div class="job_top_ job_top_two">
					<div class="job_man_topone">
						<span class="job_top_span">职位类型</span>
					</div>
					<div class="job_toptwo">
						<Select v-model="type" >
				        	<Option v-for="item in Contract" :value="item.value" :key="item.value">{{ item.label }}</Option>
				    	</Select>
					</div>
				</div>
				<div class="job_top_ job_top_three">
					<div class="job_man_topone">
						<span class="job_top_span">合同状态</span>
					</div>
					<div class="job_toptwo">
						<Select v-model="con">
				       		<Option v-for="item in PType" :value="item.value" :key="item.value">{{ item.label }}</Option>
				    	</Select>
					</div>
				</div>
				<div class="job_top_ job_top_four">
					<div class="job_man_topone">
						<span class="job_top_span">发布状态</span>
					</div>
					<div class="job_toptwo">
						<Select v-model="rel">
				       		<Option v-for="item in Release" :value="item.value" :key="item.value">{{ item.label }}</Option>
				    	</Select>
					</div>
				</div>
				<div style="width: 70px;float: right;margin-top: 8px;">
					<i-button type="primary" style="width: 70px;" @click="TemplateClick">搜索</i-button>
				</div>
			</div>
	    </Card>	
	</div>
</template>
<script>
	export default {
    	name: 'Top',
		data () {
            return {
            	type:"不限",
            	keyword:"",
            	con:"不限",
            	rel:"不限",
            	PType:[
            		{
                        value: '不限',
                        label: '不限'
                    },
                    {
                        value: '实习职位',
                        label: '实习职位'
                    },
                    {
                        value: '社会职位',
                        label: '社会职位'
                    },
                    {
                        value: '基层岗位',
                        label: '基层岗位'
                    }
            	],
            	Contract:[
            		{
                        value: '不限',
                        label: '不限'
                    },
                    {
                        value: '合同到期',
                        label: '合同到期'
                    }
            	],
            	Release:[
            		{
                        value: '不限',
                        label: '不限'
                    },
                    {
                        value: '未发布',
                        label: '未发布'
                    },
                    {
                        value: '申请中',
                        label: '申请中'
                    },
                    {
                        value: '发布中',
                        label: '发布中'
                    },
                    {
                        value: '暂停',
                        label: '暂停'
                    },
                    {
                        value: '发布结束',
                        label: '发布结束'
                    }
            	]
            }
        },
        methods:{
        	TemplateClick(){
        		alert(6666)
        	}
        }
	}	
</script>

<style>
	.con_card{
		border-top: 4px solid #2DB7F5;
	}
	.job_top{
		display: flex;
	}
	.job_top_{
		width: 22%;
		margin-right: 10px;
		height: 50px;
		line-height: 46px;
	}
	.job_man_topone{
		width: 29%;
		display: inline-block
	}
	.job_toptwo{
		width: 68%;
		display: inline-block
	}
	.job_top_span{
		display: inline-block;
	}
</style>
